<!DOCTYPE html>
<html>
<head>
<script src="../../resources/ahem.js"></script>
<script src="../resources/picker-common.js"></script>
<style>
  select:focus {
    outline-width: 0;
  }
  select {
    width: 200px;
    font: 10px Ahem;
    appearance: none;
    background-color: white;
  }
</style>
</head>
<body>
<select id='menu'>
  <option>test</option>
</select>
<script>
  var menu = document.getElementById('menu')
  if (window.testRunner) {
    testRunner.waitUntilDone();
    openPickerAppearanceOnly(menu, () => {
      requestAnimationFrame(() => {
        var option = document.createElement("option");
        option.text = "test";
        option.value = "test";
        menu.append(option);
        testRunner.notifyDone();
      });
    });
  }
</script>
</body>
</html>
